<template>
  <div class="page-common">
    <div class="mui-numbox" data-numbox-step='10' data-numbox-min='0' data-numbox-max='100'>
      <button class="mui-btn mui-numbox-btn-minus" type="button" @click="descNumber">-</button>
      <input class="mui-numbox-input" type="number"  v-model="count"/>
      <button class="mui-btn mui-numbox-btn-plus" type="button" @click="addNumber">+</button>
    </div>
  </div>
</template>
<script>
  export default {
    props:['initCount','goodid'], //接受父组建传来的值
    data() {
      return {
          count:1, //购买商品数量
        resObj:{goodid:0,type:'add'} //定义一个对象，有类型和id，默认是0，type是加
      }
    },
    created(){
      this.count = this.initCount;
    },
    components: {},
    methods:{
      descNumber(){
          this.count --;
          if(this.count <1){
              this.count = 1;
//              阻止下面的代码运行
            return;
          }
        this.sendMessage('descNumber');
      },
//      点击一次就发送一次数据
      addNumber(){
          this.count++;
        this.sendMessage('add');
      },
//      发送数据的方法
      sendMessage(type){
        this.resObj.type = type;
        this.resObj.goodid = this.goodid;
        this.$emit('cardataobj',this.resObj);
      }
    }
  }
//实现的业务
/*
1，将数据追加到loca了Storage中
1，知道goodid的值
2，将值传回到car.vue中
3，更新car.vue中的datalist中的ecount的值
//考虑是增加1，还是减-，goodis和type
*/

</script>
<style scoped>
  .page-common{
    display: inline-block;
    margin:5px;
  }
</style>
